import React, { Component } from "react";

import { NavLink ,Route,Switch} from "react-router-dom";

import CSSModules from "react-css-modules";
import {Login_register} from '../index'
import styles from "./index.scss";

import $ from 'jquery';

class Header extends Component {
    componentDidMount(){
       
    }

    constructor(props) {
        super(props);
        this.state = {value: ''};
    
        this.handleChange = this.handleChange.bind(this);
        // this.handleSubmit = this.handleSubmit.bind(this);
      }
    
      handleChange=(event)=> {
        this.setState({value: event.target.value});
        // console.log(this.state);
      }
      getSearchResult=(ev)=>{
        //   console.log(this.state.value);
          $.ajax({
              url:"http://47.110.60.142:8080/zhuiying/search",
              type:"post",
              data:{
                  pname:"西"
              },
              success:(data)=>{
                    console.log(data);
              },
            
          })
      }
    
     

    render(){


        return (
        
                <div styleName="header">
                    <div styleName="wrap">
                        <div styleName="logo"><img src="/images/home/logo_01.png" /></div>
                        <ul id="nav">
                            <li><NavLink to="/" exact activeClassName="active">首页</NavLink></li>
                            <li><NavLink to="/community" activeClassName="active">社区</NavLink></li>
                            <li><NavLink to="/user" activeClassName="active">个人中心</NavLink></li>
                            <li><NavLink to="/vip" activeClassName="active">会员</NavLink></li>
                            <li><NavLink to="/rectv" activeClassName="active">推荐</NavLink></li>
                            
                        </ul>
                        <div styleName="search">
                        <input ref="search" type="text" value={this.state.value} onChange={this.handleChange}/>
                        <button onClick={this.getSearchResult}></button>
                    </div>
                    <div styleName="lgjn">
                        <div styleName="item">
                            <NavLink to="/login_register/login">
                                <i styleName="logn"></i>
                                <span>登录</span>
                            </NavLink>
                        </div>
                        <div styleName="item">
                             <NavLink to="/login_register/register">
                                <i styleName="join"></i>
                                <span>注册</span>
                            </NavLink>
                        </div>
                       
                    </div>
                    </div>
                    
                </div>
          )
    }
}

export default CSSModules(Header, styles, { allowMultiple: true });
